<style type="text/css">
    .modal-body{height:479px;overflow-y: scroll;}
</style>
<table class="table table-bordered table-hover" id="user-list">
    <thead>
        <tr>
            <th>序号</th>
            <th>通知标题</th>
            <th>通知内容</th>
            <th>发送时间</th>
        </tr>
    </thead>    
    <tbody class="table-log"> 
        @foreach($logs as $key => $log)
            <tr id="{{$log->id}}">
                <td>{{$key + 1}}</td>
                <td>{{$log->broadcast->title}}</td>
                <td>{{ mb_substr($log->broadcast->content, 0, 10) }}...</td>
                <td>{!! str_limit($log->created_at, 16, '') !!}</td>
            </tr>
        @endforeach
    </tbody>
</table>
<div align="center">
    <a class="refresh" href="javascript:void(0)"><i class="fa fa-fw fa-refresh"></i>加载更多</a>
</div>

<script type="text/javascript">
    $(".refresh").click(function(){
        var offset = $(".table-log tr:last").attr('id');
        $.ajax({
          type: "get",
          dataType: "json",
          url: '/admin/broadcast/log_page/{{$cast->id}}',
          data: {
            offset: offset
          },
          success: function (data) {
            if (data.flag) {
                var html = '';
                var num = $(".table-log tr:last td:first").html();
                for (var i=0; i<data.data.length; i++) {
                    num++;
                    html += '<tr id='+data.data[i].id+'><td>'+num+'</td><td>'+data.data[i].title+'</td><td>'+data.data[i].content+'</td><td>'+data.data[i].created_at+'</td></tr>';
                }
                $(".table-log").append(html);
            } else {
                $(".refresh").html('暂无更多');
            }
          }
        });
    });      
</script>